<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <form action="#" method="post">
        <input type="text" size="18" id="uid" name="uid" onblur="check()" placeholder="请输入身份证号码">
        <span id="tip"> </span>
        <span id="show" style="display: block"> </span>
    </form>
</body>
<script type="application/javascript">
    var uid = document.getElementById("uid");
    var tip = document.getElementById("tip");
    function check() {
        var u_value = uid.value;
        var reg = /^[1-9][0-9]{5}([1][9][0-9]{2}|[2][0][0|1][0-9])([0][1-9]|[1][0|1|2])([0][1-9]|[1|2][0-9]|[3][0|1])[0-9]{3}([0-9]|[X])$/;
        if(!reg.test(u_value)||u_value.length!=18){
            tip.innerHTML = "请输入正确的身份证号码";
            tip.style = "color:red";
        }else{
            tip.innerHTML = "格式正确";
            tip.style = "color:black";
            showInfo();
        }
    }
    function showInfo() {
        var birth = uid.value.substring(6,14);
        var year = birth.substring(0,4);
        var month = birth.substring(4,6);
        var day = birth.substring(6,8);
        var s = uid.value.substring(16,17);
        var str1 = "生日："+month+"月"+day+"日";
        // console.log(uid.value+" "+birth+" "+year+" "+month+" "+day+" "+s+" ");
        var str2;
        if(s%2==0){
            str2 = "性别：女";
        }else{
            str2 = "性别：男";
        }
        show.innerHTML = str1 +"<br>"+ str2
    }
</script>
</html>